<template>
	<div class="flex">
		<div class="OrderYourRemarks_Text">
			<strong>您的备注</strong>
			<span>请放大厅一楼桌子</span>
		</div>
		<div class="OrderYourPreference_Text">
			<strong>您的偏好</strong>
			<span>不要放糖，只要鱼不要酸菜，要重辣</span>
		</div>
		<div class="msg">
			<strong>√</strong>
			<span>您的订单已成功提交，您可以随时查看订单配送状态</span>
		</div>
	</div>
</template>

<script>
export default {
	name: 'OrderIngredientsYourRemarks',
};
</script>

<style scoped>
.flex {
	display: flex;
	flex-direction: column;
	height: auto;
	margin: 22px 0 20px 27px;
}
.OrderYourRemarks_Text,
.OrderYourPreference_Text {
	display: flex;
	flex-direction: column;
}
.OrderYourRemarks_Text > strong,
.OrderYourRemarks_Text > span,
.OrderYourPreference_Text > strong,
.OrderYourPreference_Text > span {
	color: rgb(0, 0, 0);
	font-family: Noto Sans SC;
	font-size: 12px;
	font-weight: 400;
	line-height: 18px;
	letter-spacing: 0px;
	text-align: left;
	text-transform: uppercase;
}
.OrderYourRemarks_Text > span,
.OrderYourPreference_Text > span {
	color: rgb(110, 124, 135);
	margin-bottom: 10px;
}
.msg {
	width: 323px;
	height: 57px;
	background: rgb(255, 248, 227);
	border-radius: 8px;
	text-align: center;
	line-height: 57px;
}
.msg > strong,
.msg > span {
	color: rgb(235, 165, 66);
	font-family: Noto Sans SC;
	font-size: 10px;
	font-weight: 400;
	line-height: 12px;
	letter-spacing: 0px;
}
.msg > strong {
	margin-right: 20px;
}
</style>
